
<!-- PICK A BORDER -->
<fieldset id="fldPickBorder"><legend>{#stylelibrary_dlg.border_style_panel} <span id="txtSideNote"></span></legend>

	<table>
		<tr>
			<td rowspan="3">
				<div id="borderwrap">
					<div id="border"></div>
					<a id="bordercover" onclick="BorderPicker.selectSideClicked(event); borderPicked();" title="{#stylelibrary_dlg.all_sides}"></a>
				</div>
			</td>
			<td colspan="2">
				<div id="borderpicker" class="borderpicker">
					<span class="box notset" title=""><input type="radio" name="rdbBorderStyle" value="" onclick="borderPicked();" /></span>
						<!-- option value="hidden">{#stylelibrary_dlg.border_hidden}</option IE8 doesn't know -->
					<span class="box none" title="{#stylelibrary_dlg.border_none}"><input type="radio" name="rdbBorderStyle" value="none" onclick="borderPicked();" /></span>
					<span class="box solid" title="{#stylelibrary_dlg.border_solid}"><input type="radio" name="rdbBorderStyle" value="solid" onclick="borderPicked();" /></span>
					<span class="box dotted" title="{#stylelibrary_dlg.border_dotted}"><input type="radio" name="rdbBorderStyle" value="dotted" onclick="borderPicked();" /></span>
					<span class="box dashed" title="{#stylelibrary_dlg.border_dashed}"><input type="radio" name="rdbBorderStyle" value="dashed" onclick="borderPicked();" /></span>
					<span class="box double" title="{#stylelibrary_dlg.border_double}"><input type="radio" name="rdbBorderStyle" value="double" onclick="borderPicked();" /></span>
					<span class="box groove" title="{#stylelibrary_dlg.border_groove}"><input type="radio" name="rdbBorderStyle" value="groove" onclick="borderPicked();" /></span>
					<span class="box ridge" title="{#stylelibrary_dlg.border_ridge}"><input type="radio" name="rdbBorderStyle" value="ridge" onclick="borderPicked();" /></span>
					<span class="box inset" title="{#stylelibrary_dlg.border_inset}"><input type="radio" name="rdbBorderStyle" value="inset" onclick="borderPicked();" /></span>
					<span class="box outset" title="{#stylelibrary_dlg.border_outset}"><input type="radio" name="rdbBorderStyle" value="outset"  onclick="borderPicked();" /></span>
				</div>
				<div style="clear:both;"></div>
			</td>
		</tr>
		<tr>
			<td>
				{#stylelibrary_dlg.border_width}
			</td>
			<td>
				<input id="ddlBorderWidth" type="number" class="num" onchange="borderPicked()" min="0" />
			</td>
		</tr>
	

		<tr>
			<td>
				{#stylelibrary_dlg.border_color}
			</td>
			<td>
				<table>
				<tr>
					<td>
						<input id="bordercolor" name="bordercolor" type="text" value="" size="9" onchange="updateColor('bordercolor_pick','bordercolor'); borderPicked()" />
					</td>
					<td>
						<span id="bordercolor_pickcontainer"><b id="bordercolor_pick">&nbsp;</b></span>
					</td>
					<td>
						<input type="button" value="{#stylelibrary_dlg.remove_border}" onclick="BorderPicker.clear(); borderPicked();" />
					</td>
				</tr>
				</table>
			</td>
		</tr>
	</table>

</fieldset>

<script type="text/javascript">
var BorderPicker = new simpleBorderPicker();
</script>
